<script setup>

</script>

<template>
  <div class="common-layout">
    <el-container>
      <el-aside width="210px" style="height: 820px;background-color: rgb(109,151,110);" >
        <el-scrollbar >
          <el-menu :default-openeds="['1', '3']">

            <el-sub-menu index="1" style="background-color: #104F3D;">
              <template #title>
                <el-icon style="color:white;">
                  <setting/>
                </el-icon><p style="color: white;font-size: 18px;">管理端</p>
              </template>
              <el-menu-item-group style="background-color: rgb(109,151,110);">
                  <template #title><p style="color: white;font-size: 18px;margin-bottom: 0px;">信息管理</p></template>

                <el-menu-item index="1-1">
                  <RouterLink to="/admin/admin_manage">
                    <el-button style="margin-bottom: 8px;background-color: rgb(243,201,110);color: white;width: 120px;height: 40px;font-size: 14px;border: none;border-radius: 6px;">
                      管理人员管理
                    </el-button>
                  </RouterLink>
                </el-menu-item>

                <el-menu-item index="1-2">
                  <RouterLink to="/admin/users_manage">
                    <el-button style="margin-bottom: 8px;background-color: rgb(243,201,110);color: white;width: 120px;height: 40px;font-size: 14px;border: none;border-radius: 6px;">
                      用户管理
                    </el-button>
                  </RouterLink>
                </el-menu-item>

                <el-menu-item index="1-3">
                  <RouterLink to="/admin/books_manage">
                    <el-button style="margin-bottom: 8px;background-color: rgb(243,201,110);color: white;width: 120px;height: 40px;font-size: 14px;border: none;border-radius: 6px;">
                      书籍管理
                    </el-button>
                  </RouterLink>
                </el-menu-item>

                <el-menu-item index="1-5">
                <RouterLink to="/admin/return_manage">
                  <el-button style="margin-bottom: 8px;background-color: rgb(243,201,110);color: white;width: 120px;height: 40px;font-size: 14px;border: none;border-radius: 6px;">
                    还阅管理
                  </el-button>
                </RouterLink>
                </el-menu-item>

              </el-menu-item-group>

              <el-menu-item-group style="background-color: rgb(109,151,110);">
                  <template #title><p style="color: white;font-size: 18px;margin-bottom: 0px;">读者互动</p></template>
                <el-menu-item index="2-1">
                  <RouterLink to="/admin/information_manage">
                    <el-button style="margin-bottom: 8px;background-color: rgb(243,201,110);color: white;width: 120px;height: 40px;font-size: 14px;border: none;border-radius: 6px;">
                      公告编辑
                    </el-button>
                  </RouterLink>
                </el-menu-item>

                <el-menu-item index="2-2">
                  <RouterLink to="/admin/booksReport">
                    <el-button style="margin-bottom: 8px;background-color: rgb(243,201,110);color: white;width: 120px;height: 40px;font-size: 14px;border: none;border-radius: 6px;">
                      图书报表展示
                    </el-button>
                  </RouterLink>
                </el-menu-item>

                  <el-menu-item index="2-3">
                      <RouterLink to="/admin/reply">
                          <el-button  style="margin-bottom: 8px;background-color: rgb(243,201,110);color: white;width: 120px;height: 40px;font-size: 14px;border: none;border-radius: 6px;">
                              咨询回复
                          </el-button>
                      </RouterLink>
                  </el-menu-item>


                  <el-menu-item index="2-4">
                      <RouterLink to="/admin/file_manage">
                          <el-button class="el-buttons" style="margin-bottom: 8px;background-color: rgb(243,201,110);color: white;width: 120px;height: 40px;font-size: 14px;border: none;border-radius: 6px;">
                              读者来信查看
                          </el-button>
                      </RouterLink>
                  </el-menu-item>
              </el-menu-item-group>

            </el-sub-menu>

          </el-menu>
        </el-scrollbar>
      </el-aside>
      <el-container>

        <el-header style="height:56px;border-bottom: 1px solid black ;display: flex;flex-direction: row;background-color: rgb(109,151,110);">
          <h1 style="font-size: 25px;margin-top: 13px;margin-left: -10px;color: white;">欢迎进入图书管理系统</h1>
            <img src="../assets/logo.jpg" style="display:flex;justify-content: flex-end; margin-left: auto; width:56px;margin-top: 0px;" />

        </el-header>

        <el-main>
          <RouterView></RouterView>
        </el-main>

      </el-container>
    </el-container>
  </div>
</template>

<style scoped>
.el-menu-item{
    height: 60px;
}
.el-button:hover{
    background-color: #646cff;
}

</style>

